<template>
  <el-dialog title="编辑" :visible.sync="dialogEditorVisible" width="70%" @before-close="handleClose">
    <el-form label-width="70px" :model="editorForm" ref="editorForm">
      <el-form-item label="序号">
        <el-input v-model="editorForm.id" />
      </el-form-item>
      <el-form-item label="标题">
        <el-input v-model="editorForm.title" />
      </el-form-item>
      <el-form-item label="图片">
        <el-input v-model="editorForm.image" />
      </el-form-item>
      <!-- <el-form-item label="商品图片">
        <el-button type="primary" class="location" @click="dialogUploadHandle">图片上传</el-button>
        <img class="upload-img" :src="uploadData.url" alt="" />
        <el-dialog width="50%" append-to-body title="图片上传" :visible.sync="dialogUploadVisible">
          <ProductUpload @onUpload="getOnUpload" />
          <span slot="footer" class="dialog-footer">
            <el-button type="primary" @click="dialogUploadVisible = false">确 定</el-button>
          </span>
        </el-dialog>
      </el-form-item> -->
      <!-- <el-form-item label="商品描述">
                <ProductWangEditor @onEditor="getEditor" :currentEditorData="editorData"/>
            </el-form-item> -->
    </el-form>
    <span slot="footer" class="dialog-footer">
      <el-button @click="dialogEditorVisible = false">取 消</el-button>
      <el-button type="primary" @click="editorProductHandle">确 定</el-button>
    </span>
  </el-dialog>
</template>

<script>
  // import ProductTree from "./ProductTree";
  // import ProductUpload from "./ProductUpload";
  // import ProductBaiduUEditor from "./ProductBaiduUEditor";
  // import ProductWangEditor from "./ProductWangEditor";

  export default {
    data() {
      return {
        dialogEditorVisible: false,
        dialogCategoryVisible: false,
        dialogUploadVisible: false,
        editorForm: {
          id: "",
          title: "",
          image: "",
          //   num: "",
        },
      }
    },
    components: {
      // ProductTree,
      // ProductBaiduUEditor,
      // ProductUpload,
      // ProductWangEditor,
    },
    mounted() {
      this.$bus.$on("onEditorEvent", (row) => {
        this.dialogEditorVisible = true;
        console.log(row)
        // 获取预更新数据
        this.editorForm = row
        // this.$api.home.updateIndex({
        //   id: row.id
        // }).then((res) => {
        //   console.log(res.data)
        //   this.editorForm.id = res.data[0].id
        //   this.editorForm.img = res.data[0].image
        //   this.editorForm.title = res.data[0].title
        // })
      });
    },
    methods: {
      handleClose() {
        this.$confirm("确认关闭？")
          .then((_) => {
            done();
          })
          .catch((_) => {});
      },
      /**
       * 接受富文本数据
       */
      getEditor(data) {
        this.editorData = data;
      },
      /**
       * 编辑产品
       *  重新提交数据
       */
      editorProductHandle() {
        this.$api.home.updateIndex( {
          "id": this.editorForm.id,
          "title": this.editorForm.title,
          "image": this.editorForm.image
        }).then(res => {
          this.dialogEditorVisible = false
          this.$bus.$emit("refresh", true)
        })
      },
    },
  };

</script>

<style scoped>
  .location {
    float: left;
  }

  .tree {
    float: left;
    margin-left: 10px;
  }

  .upload-img {
    float: left;
    width: 300px;
    margin-left: 10px;
  }

</style>
